.InvestmentA01 {
	width: 100%;
	height: 100%;
	padding: 8px;
	display: flex;
	align-items: center;
	justify-content: center;

	& > div {
		height: 100%;
		padding: 8px;

		&.Right {
			flex: 1487;
			display: flex;
			align-items: center;
			justify-content: center;
			flex-direction: column;

			& > div {
				width: 100%;
				flex: 1;

				&.Top {
					display: flex;
					align-items: center;
					justify-content: center;
					margin-bottom: 16px;

					& > div {
						height: 100%;
						cursor: pointer;

						&.left {
							flex: 3;
							display: flex;
							align-items: center;
							justify-content: center;
							padding: 0 16px;

							& > div:nth-child(1) {
								width: 280px;
								height: 280px;
								margin-right: 16px;
								position: relative;
								z-index: 1;
								display: flex;
								align-items: center;
								justify-content: center;

								& > img {
									position: absolute;
									left: 0;
									top: 0;
									width: 100%;
									height: 100%;
									display: block;
								}

								.ChartsNumber {
									font-family: Microsoft YaHei;
									font-weight: bold;
									color: #ffffff;

									& > div:first-child {
										font-size: 24px;
										height: 24px;
										line-height: 24px;
										margin-bottom: 4px;
									}

									& > div:last-child {
										font-size: 18px;
										height: 18px;
										line-height: 18px;
									}
								}
							}

							& > div:nth-child(2) {
								flex: 3;
								display: flex;
								align-items: center;
								justify-content: center;
								flex-wrap: wrap;
								position: relative;
								z-index: 1;

								&::after,
								&::before {
									position: absolute;
									content: "";
									z-index: -1;
									background: rgba(211, 251, 255, 0.2);
								}

								&::after {
									width: 100%;
									height: 1px;
									left: 0;
									top: calc(50% - 1px);
								}

								&::before {
									width: 1px;
									height: 100%;
									left: calc(50% - 1px);
									top: 0;
								}

								& > div {
									width: 50%;
									height: 120px;
									display: flex;
									align-items: center;

									& > div:first-child {
										width: 72px;
										height: 62px;
										position: relative;
										z-index: 1;
										margin-right: 32px;
										margin-left: 40px;

										& > img:first-child {
											position: absolute;
											left: 0;
											top: 0;
											width: 100%;
											height: 100%;
											z-index: 1;
											display: block;
										}

										& > img:last-child {
											position: absolute;
											left: 20px;
											top: 0;
											width: 32px;
											height: 32px;
											z-index: 2;
											display: block;
										}
									}

									& > div:last-child {
										display: flex;
										align-items: flex-start;
										justify-content: center;
										flex-direction: column;

										& > div:first-child {
											font-family: MicrosoftYaHei, MicrosoftYaHei;
											font-weight: bold;
											font-size: 12px;
											color: #cafcff;
											margin-bottom: 4px;
										}

										& > div:last-child {
											position: relative;
											z-index: 1;
											display: flex;
											align-items: center;
											justify-content: center;

											& > div:first-child {
												font-family: YouSheBiaoTiHei;
												font-size: 30px;
												color: #cafcff;
												line-height: 22px;
												text-shadow: 3px 4px 2px #18528d;
												margin-right: 8px;

												& > img {
													position: absolute;
													left: -12px;
													bottom: -8px;
													width: 78px;
													height: 22px;
													z-index: -1;
													display: block;
												}
											}

											& > div:last-child {
												font-family: MicrosoftYaHei, MicrosoftYaHei;
												font-weight: bold;
												font-size: 12px;
												color: #cafcff;
											}
										}
									}
								}
							}
						}
					}
				}

				&.Btm {
					display: flex;
					align-items: center;
					justify-content: center;
					flex-direction: column;

					& > div {
						width: 100%;

						&.box {
							flex: 1;
							display: flex;
							align-items: center;
							justify-content: center;

							& > div {
								height: 100%;

								&.optioins {
									width: 240px;
									margin-right: 16px;
									display: flex;
									align-items: center;
									justify-content: center;
									flex-direction: column;

									& > div {
										width: 100%;

										&.Nav {
											flex: 1;
											margin-bottom: 16px;
											display: flex;
											align-items: center;
											justify-content: center;
											flex-direction: column;

											& > div {
												width: 100%;
												flex: 1;
												display: flex;
												align-items: center;
												justify-content: center;
												font-family: YouSheBiaoTiHei;
												font-size: 18px;
												color: #97fff6;
												background: rgba(17, 101, 192, 0.2);
												cursor: pointer;
												position: relative;
												z-index: 1;

												& > img {
													position: absolute;
													left: 0;
													top: 0;
													width: 100%;
													height: 100%;
													object-fit: contain;
													display: block;
												}

												&.active {
													color: white;
													border: 2px solid #8fecff;
													background: linear-gradient(
														180deg,
														rgba(0, 77, 161, 1),
														rgba(0, 29, 73, 1)
													);
												}
											}
										}
									}
								}

								&.Charts {
									flex: 1;
								}
							}
						}
					}
				}
			}
		}
	}
}

.InvestmentA02 {
	width: 100%;
	height: 100%;
	padding: 16px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;

	& > div {
		width: 100%;

		&.Nav {
			display: flex;
			align-items: center;
			justify-content: center;

			& > div:first-child {
				flex: 1080;
				height: 80px;
				background: rgba(17, 101, 192, 0.2);
				display: flex;
				align-items: center;
				justify-content: center;
				margin-right: 16px;

				& > div {
					flex: 1;
					height: 100%;
					display: flex;
					align-items: center;
					justify-content: center;
					font-family: YouSheBiaoTiHei;
					font-size: 20px;
					color: #97fff6;
					position: relative;
					z-index: 1;
					cursor: pointer;

					& > img {
						position: absolute;
						left: 0;
						top: 0;
						width: 100%;
						height: 100%;
						display: block;
						z-index: -1;
						object-fit: cover;
					}

					&.Active {
						border: 2px solid #8fecff;
						background: linear-gradient(
							0deg,
							rgba(0, 29, 73, 1),
							rgba(0, 77, 161, 1)
						);
					}
				}
			}

			& > div:last-child {
				width: 288px;
			}
		}

		&.ChartsBox {
			flex: 1;
		}
	}
}
